<template>
    <view class="pub_page pub_agentStore_send pub_header_padding">
        <pub-head :headerConfig="headerConfig"></pub-head>
        <pub-dialog v-show="dialogShow" :dialogConfig="dialogConfig" @dialogBack="dialogBack"></pub-dialog>
        <div class="pub_page_scroll page_box">
            <div class="input_div" v-if="giveType !== 2">
                <div class="title">赠送对方手机号</div>
                <div class="inputs">
                    <div class="input">
                        <input type="text" v-model="giveInfo.mobile" maxlength="11">
                    </div>
                </div>
            </div>
            <div class="input_div">
                <div class="title">{{numTxt}}数量</div>
                <div class="inputs">
                    <div class="input">
                        <input type="text" v-model="giveInfo.num">
                    </div>
                </div>
                <!-- <div class="msg">xxx</div> -->
            </div>
            <div class="input_div">
                <div class="title">支付密码</div>
                <div class="inputs">
                    <div class="input">
                        <input type="password" v-model="giveInfo.payPassword" maxlength="6">
                    </div>
                </div>
                <br>
                <br>
                <div class="pub_btn" @click="toDeal('to_give')">确认</div>
            </div>
            <br>
        </div>
    </view>
</template>

<script>
export default {
    data() {
        return {

            sendMobile: '',

            giveType: 2,//1：积分 2：抵用券=》营业额 3:营业额=》抵用券"
            // 转赠相关数据
            giveInfo: {
                mobile: '',
                num: '',
                payPassword: '',
            },

            dialogShow: false,
            dialogType: '',
            dialogConfig: {
                title: '提示',//标题栏内容
                content: ''
            },
        };
    },
    computed: {
        headerConfig() {
            const title = ['', '', '线下购物', '']
            return {
                title: title?.[this.giveType] || '赠送',//标题栏内容
                left_type: 3,
                title_color: '#000',
                left_content: 'dark',
                header_color: '#fff'
            }
        },
        numTxt() {
            const txt = ['', '', '支付', '']
            return txt?.[this.giveType] || '赠送'
        }
    },
    watch: {
        'giveInfo.num': {
            handler() {
                this.giveInfo.num = this.giveInfo.num.replace(/^(0+)|[^\d]+/g, '');
                // this.giveProNum = Math.round(this.giveInfo.num * this.giveGetPro * 100) / 100;
            },
            immediate: true,
            deep: true
        },
    },
    onLoad(options) {
        this.sendMobile = options?.mobile
        this.giveType = Number(options?.giveType);
        if (this.giveType === 2) {
            this.giveInfo.mobile = this.sendMobile;
        }
    },
    methods: {
        dialogBack(data) {
            // console.log(data);
            this.dialogShow = false;
            if (data.key == 1) {
                this.toDeal(this.dialogType)
            }
        },
        async toDeal(type, data_1, data_2) {
            switch (type) {
                case 'to_give':
                    if (!this.giveInfo.mobile) {
                        this.$comFun.toast('请先填写手机号');
                        return;
                    }
                    if (this.giveInfo.num == '' || !this.$comFun.ValidateNum(this.giveInfo.num)) {
                        this.$comFun.toast('请先填写正确的数量');
                        return;
                    }
                    if (!this.giveInfo.payPassword) {
                        this.$comFun.toast('请先填写支付密码');
                        return;
                    }
                    this.dialogType = 'sure_give';
                    this.dialogConfig = {
                        title: '提示',//标题栏内容
                        content: '是否确定进行此操作？'
                    }
                    this.dialogShow = true;
                    break;
                case 'sure_give':
                    this.$comFun.openLoading();
                    const res_2 = await this.$request.post('user/give', {
                        ...this.giveInfo,
                        type: this.giveType
                    });
                    // console.log(res_2);
                    this.$comFun.closeLoading();
                    if (res_2.code == 200) {
                        this.giveInfo.mobile = '';
                        this.giveInfo.num = '';
                        this.giveInfo.payPassword = '';
                        this.$comFun.toast('操作成功');
                        setTimeout(() => {
                            uni.switchTab({
                                url: '/pages/mine/index'
                            });
                        }, 1000)
                    } else {
                        this.$comFun.toast(res_2.message);
                    }
                    break;
                default:
                    break;
            }
        },
    },
};
</script>

<style lang="scss" scoped>
.pub_agentStore_send {
    background-color: #f8f8f8;

    .page_box {

        .input_div {
            width: calc(100% - 60rpx);
            border-radius: 24rpx;
            margin: 52rpx auto 32rpx auto;

            .title {
                font-size: 28rpx;
                color: #000;
                line-height: 40rpx;
                font-weight: bold;
            }

            .msg {
                font-size: 24rpx;
                color: #F8211D;
                line-height: 34rpx;
                margin-top: 12rpx;
            }

            .inputs {
                width: 100%;

                .input {
                    width: 100%;
                    height: 110rpx;
                    padding: 25rpx 20rpx;
                    background-color: #FFFFFF;
                    border-radius: 16rpx;
                    margin-top: 24rpx;
                    position: relative;

                    input {
                        width: 100%;
                        height: 60rpx;
                        line-height: 60rpx;
                        font-size: 32rpx;
                        color: #333;
                    }
                }
            }

            .pub_btn {
                width: 70%;
            }
        }
    }
}
</style>
